<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>蓝风短链平台</title>
    <meta http-equiv="description"
          content="蓝风短链平台提供专业的网址缩短服务，具有稳定、快速、安全的特点，帮您把冗长的URL地址缩短成6个字符以内的短网址，支持批量缩短，淘宝百度网址缩短、营销数据分析、开放API接口等服务"/>
    <meta http-equiv="keywords"
          content="蓝风软件,短链生成,在线短链生成,长链转短链,短网址,短链接,短连接,网址缩短,短域名,短地址,缩短网址,url缩短,短网址生成,短网址在线生成,短网址生成器,短网址在线转换,短网址接口,免费短网址"/>
    <link rel="icon" th:href="@{/images/favicon.ico}">
    <link rel="bookmark" th:href="@{/images/favicon.ico}">
    <link rel="stylesheet" href="https://lf3-cdn-tos.bytecdntp.com/cdn/element-ui/2.15.7/theme-chalk/index.min.css">
    <script src="https://lf26-cdn-tos.bytecdntp.com/cdn/vue/2.6.12/vue.min.js" type="application/javascript"></script>
    <script src="https://lf26-cdn-tos.bytecdntp.com/cdn/element-ui/2.15.7/index.min.js"></script>

    <style>
        html, body {
            margin: 0;
            height: 100%;
            padding: 0;
            font-family: 'microsoft yahei', Tahoma, Verdana, sans-serif, simsun;
            font-size: 13px;
            color: #505050;
        }

        a {
            color: #606288;
        }

        h1, h2, h3, ul, li {
            margin: 0;
            padding: 0;
        }

        h1, h2, h3, h4, h5 {
            font-weight: bold;
        }

        p {
            margin: 10px 0 10px 0;
            line-height: 24px;
            font-size: 18px;
            font-weight: 400;
        }

        #bd {
            width: 900px;
            margin: 20px auto;
            padding: 10px;
        }
    </style>
</head>
<body>
<div id="app" style="height: 100%;">
    <el-container style="height: 100%;">
        <el-header style="padding: 0;">
            <el-row style="background-color:#00162A; height: 60px">
                <el-col :span="8">
                    <span style="color: white;font-size: 30px;font-weight: bold;line-height: 60px;margin-left: 20px;cursor: pointer"
                          @click="freshWeb">
                        <i class="el-icon-share"></i>&nbsp;蓝风短链平台
                    </span>
                </el-col>
                <el-col :span="14">
                    <el-menu :default-active="activeIndex" mode="horizontal" @select="handleSelect"
                             background-color="#00162A" text-color="#fff" active-text-color="#ffd04b">
                        <el-menu-item index="index">
                            <span style="font-weight: bold">首页</span>
                        </el-menu-item>
                        <el-menu-item index="apidoc">
                            <span style="font-weight: bold">API文档</span>
                        </el-menu-item>
                        <el-menu-item index="about">
                            <span style="font-weight: bold">关于我们</span>
                        </el-menu-item>
                    </el-menu>
                </el-col>

                <el-col :span="2" style="padding-top: 12px">
                    <el-button size="medium" round @click="login()">注册/登录</el-button>
                </el-col>
            </el-row>
        </el-header>
        <el-main style="background-color: #FFF;">
            <div id="bd">
                <h2> 蓝风短链平台 </h2>
                <p>蓝风短链平台提供专业的网址缩短服务，把冗长的URL地址缩短成6个字符以内的短网址，稳定、快速、安全；同时支持API接口调用、网址访问分析等服务。</p>

                <h2> 联系我们 </h2>
                <p>地址：XX省XX市XX区XX街道</p>
                <p>电话：132XXXXXXXX</p>
            </div>
        </el-main>

        <el-footer style="background-color: #FFF">
            <el-row>
                <el-col :span="24" align="middle">
                    <span style="color: #606288;font-size: 12px;">
                        免责声明：短链接由用户生成，所跳转的内容与本站无关。本站禁止违法违规内容的网站生成短链接，如有发现立刻封停！
                    </span>
                    <br/>
                    <span style="color: #606288;font-size: 12px;">
                        ICP备案：<a href="http://beian.miit.gov.cn" target="_blank">鲁ICP备xxxxxxx号-1</a> | 联系我们：xxxx@163.com | <a
                            href="https://www.baidu.com/" target="_blank">资讯中心</a> | <a href="https://www.baidu.com/"
                                                                                        target="_blank">关于我们</a>
                    </span>
                </el-col>
            </el-row>
        </el-footer>
    </el-container>
</div>


<script>
    var ctx = /*[[@{/}]]*/'';

    new Vue({
        el: '#app',
        data: function () {
            return {
                message: 'Hello Vue.js!',
                activeIndex: 'about'
            }
        },
        methods: {
            freshWeb() {
                window.location.reload();
            },
            login() {
                // 跳转租户登录页
                window.location.href = ctx + "tenant/login";
            },
            handleSelect(key, keyPath) {
                console.log(key, keyPath);
                if (key === 'index') {
                    window.location.href = ctx + '/';
                } else if (key === 'apidoc') {
                    window.location.href = ctx + 'apiDoc';
                } else if (key === 'about') {
                    window.location.href = ctx + 'about';
                }
            }
        }
    });
</script>
</body>
</html>